<div class="editor-row">
  <div class="section">
    <h5>Values</h5>
    <div class="editor-option">
      <label class="small">Chart value</label>
      <select ng-change="set_refresh(true)" class="input-small" ng-model="panel.mode" ng-options="f for f in ['count','min','mean','max','total']"></select>
    </div>
    <div class="editor-option" ng-show="panel.mode != 'count'">
      <label class="small">Value Field <tip>This field must contain a numeric value</tip></label>
        <input ng-change="set_refresh(true)" placeholder="Start typing" bs-typeahead="fields.list" type="text" class="input-medium" ng-model="panel.value_field">
    </div>
  </div>
  <div class="section">
    <h5>Transform Series</h5>
    <div class="editor-option" ng-show="panel.mode != 'count'">
      <label class="small">Scale</label>
        <input type="text" class="input-mini" ng-model="panel.scale">
    </div>
    <div class="editor-option">
      <label class="small">Seconds <tip>Normalize intervals to per-second</tip></label><input type="checkbox" ng-model="panel.scaleSeconds" ng-checked="panel.scaleSeconds">
    </div>
    <div class="editor-option">
      <label class="small">Derivative <tip>Plot the change per interval in the series</tip></label><input type="checkbox" ng-model="panel.derivative" ng-checked="panel.derivative" ng-change="set_refresh(true)">
    </div>
    <div class="editor-option">
      <label class="small">Zero fill <tip>Fills zeros in gaps.</tip></label><input type="checkbox" ng-model="panel.zerofill" ng-checked="panel.zerofill" ng-change="set_refresh(true)">
    </div>
  </div>
  <div class="section">
  <h5>Time Options</h5>
    <div class="editor-option">
      <label class="small">Time Field</label>
        <input ng-change="set_refresh(true)" placeholder="Start typing" bs-typeahead="fields.list" type="text" class="input-small" ng-model="panel.time_field">
    </div>
    <div class="editor-option">
      <label class="small">Time correction</label>
      <select ng-model="panel.timezone" class='input-small' ng-options="f for f in ['browser','utc']"></select>
    </div>
    <div class="editor-option">
      <label class="small">Auto-interval</label><input type="checkbox" ng-model="panel.auto_int" ng-checked="panel.auto_int" />
    </div>
    <div class="editor-option" ng-show='panel.auto_int'>
      <label class="small">Resolution <tip>Shoot for this many data points, rounding to sane intervals</tip></label>
      <input type="number" class='input-mini' ng-model="panel.resolution" ng-change='set_refresh(true)'/>
    </div>
    <div class="editor-option" ng-hide='panel.auto_int'>
      <label class="small">Interval <tip>Use Elasticsearch date math format (eg 1m, 5m, 1d, 2w, 1y)</tip></label>
      <input type="text" class='input-mini' ng-model="panel.interval" ng-change='set_refresh(true)'/>
    </div>
  </div>
</div>